﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>类C# GridView的编辑效果（一）</title>
</head>
<body>
<table>
    <tr>
        <td id="td1">张三</td>
        <td>
            <a href="javascript:edit()">编辑</a>
        </td>
    </tr>
</table>
<script type="text/javascript">
    function edit(){
        var cell = document.getElementById("td1");   // 获取表格
        var v = cell.innerHTML; // 获取表格的内容
        cell.innerHTML ='<input type="text" name="text1" id="text1">';  // 动态添加文本框
        document.getElementById('text1').value = v; // 设置文本框的值
    }
</script>
</body>
</html>